<template>
  <div class="app-container">


    <!--编制工作台查询区域-->
    <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
      <el-form-item v-for="item in dimensionOptions" :label="item.label" :prop="item.value">
        <el-input style="width: 215px;" v-model="queryParams.dyParams[item.value]" clearable placeholder="请输入"/>
      </el-form-item>
      <el-form-item label="指标" prop="keyfigureId">
        <el-select
            v-model="queryParams.keyfigureId"
            placeholder="请选择指标"
            style="width:330px;"
        >
          <el-option
              v-for="item in keyfigureIdOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="时间" prop="time">
        <el-input
            v-model="queryParams.time"
            placeholder="请输入时间"
            clearable
            @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <!--操作按钮-->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
            type="primary"
            plain
            icon="Plus"
            @click="handleAdd"
        >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
            type="warning"
            plain
            icon="Download"
            @click="handleExport"
            v-hasPermi="['monitor:job:export']"
        >导出
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
            type="info"
            plain
            icon="Upload"
            @click="openImportTable"
            v-hasPermi="['tool:gen:import']"
        >导入</el-button>
      </el-col>
      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <!--编制工作台多表头区域-->
    <el-table class="table-container" v-loading="loading"
              stripe
              border
              :data="keyfingureList"
              :show-overflow-tooltip='true'
              :header-cell-style="{'border-right':'1px solid #EEEEEE'}"
              :cell-style="{'border-right':'1px solid #EEEEEE'}"
              :row-class-name="iconHadler"
              @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
      <el-table-column label="序号" align="center" prop="index" width="60"/>
      <el-table-column label="堆型" align="center" prop="dim1" show-overflow-tooltip="true"/>
      <el-table-column label="发电功率" align="center" prop="dim2" :show-overflow-tooltip="true"/>
      <el-table-column label="机组寿命" align="center" prop="dim3" :show-overflow-tooltip="true"/>
      <el-table-column label="装机成本" align="center" prop="dim4" :show-overflow-tooltip="true"/>
      <el-table-column label="时间" align="center" prop="time" :show-overflow-tooltip="true"/>
      <el-table-column label="指标名称" prop="keyfigureId" width="350">
        <template #default="scope">
          {{ getKeyfigureLabel(scope.row.keyfigureId) }}
        </template>
      </el-table-column>
      <el-table-column label="指标值" align="center" prop="keyfigureValue" :show-overflow-tooltip="true"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
                     v-hasPermi="['template:template:edit']">修改
          </el-button>
          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
                     v-hasPermi="['template:template:remove']">删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
    />


    <!--新增编辑弹框-->
    <el-dialog :title="title" v-model="open" width="750px" append-to-body>
      <el-form ref="templateRef" :model="form" :inline="true" :rules="rules" label-width="100px">
        <el-form-item label="id" prop="id" v-if="false">
          <el-input v-model="form.id" placeholder="请输入id"/>
        </el-form-item>
        <el-form-item label="堆型" label-width="100px" prop="dim1">
          <el-input v-model="form.dim1" placeholder="请输入堆型"/>
        </el-form-item>
        <el-form-item label="发电功率" label-width="100px" prop="dim2">
          <el-input v-model="form.dim2" placeholder="请输入发电效率"/>
        </el-form-item>
        <el-form-item label="机组寿命" label-width="100px" prop="dim3">
          <el-input v-model="form.dim3" placeholder="请输入机组寿命"/>
        </el-form-item>
        <el-form-item label="装机成本" label-width="100px" prop="dim4">
          <el-input v-model="form.dim4" placeholder="请输入装机成本"/>
        </el-form-item>
        <el-form-item label="时间" label-width="100px" prop="time">
          <el-input v-model="form.time" placeholder="请输入时间"/>
        </el-form-item>
        <el-form-item label="指标" label-width="100px" prop="keyfigureId">
          <el-select
              v-model="form.keyfigureId"
              placeholder="请选择指标"
              style="width:520px;"
          >
            <el-option
                v-for="item in keyfigureIdOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="指标值" label-width="100px" prop="keyfigureValue">
          <el-input v-model="form.keyfigureValue" placeholder="请输入指标值"/>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 导入历史数据对话框 -->
    <el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
      <el-upload
          ref="uploadRef"
          :limit="1"
          accept=".xlsx, .xls"
          :headers="upload.headers"
          :action="upload.url + '?updateSupport=' + upload.updateSupport"
          :disabled="upload.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="false"
          drag
      >
        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <template #tip>
          <div class="el-upload__tip text-center">
            <div class="el-upload__tip">
              <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
            </div>
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>
          </div>
        </template>
      </el-upload>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitFileForm">确 定</el-button>
          <el-button @click="upload.open = false">取 消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup name="areaDefinition">
import RecursiveTableHeader from "@/components/RecursiveTableHeader";

const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const {proxy} = getCurrentInstance();
const title = ref("");
const selectTree = ref("");
const versionName = ref("");

/*** 用户导入参数 */
const upload = reactive({
  // 是否显示弹出层（用户导入）
  open: false,
  // 弹出层标题（用户导入）
  title: "",
  // 是否禁用上传
  isUploading: false,
  // 是否更新已经存在的用户数据
  updateSupport: 0,
  // 设置上传的请求头部
  headers: {  },
  // 上传的地址
  url: "/system/user/importData"
});

const categoryOptions = ref([
  {
    "id": 1,
    "label": "经济预测V1版"
  },
  {
    "id": 2,
    "label": "经济预测V2版"
  },
  {
    "id": 3,
    "label": "发电量预测V1版"
  },
  {
    "id": 4,
    "label": "5年综合预测V1版"
  },
  {
    "id": 5,
    "label": "5年期综合预测V2版"
  }
]);
const keyfigureIdOptions = ref([
  {value: '1', label: '核电装机容量（二代及三代大堆）'},
  {value: '2', label: '核电装机容量（三代小堆）'},
  {value: '3', label: '核电装机容量（四代堆（高温堆））'},
  {value: '4', label: '核电装机容量（四代堆（快堆））'},
  {value: '5', label: '核电装机容量（合计）'},
  {value: '6', label: '中长期仅新建四代堆-核能发电量'},
  {value: '7', label: '中长期仅新建四代堆-核能供热量'},
  {value: '8', label: '中长期仅新建四代堆-核能供汽量（万吨标煤）'},
  {value: '9', label: '中长期仅新建四代堆-核能制氢量（万吨）'}
])


const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    code: "",
    name: "",
    isDefault: null,
    enable: null,
    dyParams: {}
  },
  rules: {
    code: [{required: true, message: "维度code不能为空", trigger: "blur"}],
    name: [{required: true, message: "维度名称不能为空", trigger: "blur"}],
  }
});

const {queryParams, form, rules} = toRefs(data);
const dimensionOptions = ref([
  {value: 'dim1', label: '堆型'},
  {value: 'dim2', label: '发电功率'},
  {value: 'dim3', label: '机组寿命'},
  {value: 'dim4', label: '装机成本'}
])
/**
 * 定义表头属性映射关系
 */
const property = {
  prop: "column",
  label: "columnName",
  width: "width",
  children: "children",
};

const keyfingureList = ref([
  {
    "id": 1,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 2,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 3,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 4,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 5,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 6,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 7,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 8,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 20,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 21,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 22,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "8",
    "keyfigureValue": "100"
  },
  {
    "id": 23,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "6",
    "keyfigureValue": "100"
  },
  {
    "id": 31,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 32,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 33,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 34,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 41,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 42,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 43,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 44,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 45,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 46,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 47,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "8",
    "keyfigureValue": "100"
  },
  {
    "id": 48,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "6",
    "keyfigureValue": "100"
  }
]);
const oldKeyfingureList = ref([
  {
    "id": 1,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 2,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 3,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 4,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 5,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 6,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 7,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 8,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2015",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 20,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 21,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 22,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "8",
    "keyfigureValue": "100"
  },
  {
    "id": 23,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2015",
    "keyfigureId": "6",
    "keyfigureValue": "100"
  },
  {
    "id": 31,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 32,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 33,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 34,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 41,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 42,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "2",
    "keyfigureValue": "101"
  },
  {
    "id": 43,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "3",
    "keyfigureValue": "120"
  },
  {
    "id": 44,
    "dim1": "二代及三代大堆",
    "dim2": "1145MW",
    "dim3": "60年",
    "dim4": "200亿",
    "time": "2020",
    "keyfigureId": "4",
    "keyfigureValue": "100"
  },
  {
    "id": 45,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 46,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "1",
    "keyfigureValue": "100"
  },
  {
    "id": 47,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "8",
    "keyfigureValue": "100"
  },
  {
    "id": 48,
    "dim1": "三代小堆",
    "dim2": "1250MW",
    "dim3": "60年",
    "dim4": "480亿",
    "time": "2020",
    "keyfigureId": "6",
    "keyfigureValue": "100"
  }
]);

// 表单重置
function reset() {
  form.value = {
    id: null,
    dim1: null,
    dim2: null,
    dim3: null,
    dim4: null,
    keyfigureId: null,
    keyfigureValue: null,
    updateBy: null,
    updateTime: null
  };
  proxy.resetForm("templateRef");
}

function getList() {
  loading.value = true;
  if (queryParams.value.dyParams.dim1 || queryParams.value.dyParams.dim2 || queryParams.value.dyParams.dim3 || queryParams.value.dyParams.dim4 || queryParams.value.keyfigureId) {
    //按照条件过滤
    if (queryParams.value.dyParams.dim1) {
      keyfingureList.value = keyfingureList.value.filter(item => item.dim1.indexOf(queryParams.value.dyParams.dim1) != -1);
    }
    if (queryParams.value.dyParams.dim2) {
      keyfingureList.value = keyfingureList.value.filter(item => item.dim2.indexOf(queryParams.value.dyParams.dim2) != -1);
    }
    if (queryParams.value.dyParams.dim3) {
      keyfingureList.value = keyfingureList.value.filter(item => item.dim3.indexOf(queryParams.value.dyParams.dim3) != -1);
    }
    if (queryParams.value.dyParams.dim4) {
      keyfingureList.value = keyfingureList.value.filter(item => item.dim4.indexOf(queryParams.value.dyParams.dim4) != -1);
    }
    if (queryParams.value.keyfigureId) {
      keyfingureList.value = keyfingureList.value.filter(item => item.keyfigureId == queryParams.value.keyfigureId);
    }
    if (queryParams.value.time) {
      keyfingureList.value = keyfingureList.value.filter(item => item.time == queryParams.value.time);
    }
  } else {
    keyfingureList.value = oldKeyfingureList.value;
  }
  total.value = keyfingureList.value.length;
  loading.value = false;
}

/** 通过条件过滤节点  */
const filterNode = (value, data) => {
  if (!value) return true;
  return data.label.indexOf(value) !== -1;
};


function handleExport() {

}


function iconHadler({row, rowIndex}) {
  row.index = rowIndex + 1;
}

/** 根据名称筛选类别树 */
watch(versionName, val => {
  proxy.$refs["categoryTreeRef"].filter(val);
});

function resetQuery() {
  proxy.resetForm("queryRef");
  keyfingureList.value = oldKeyfingureList.value;
}

function getVersionLabel(versionId) {
  const option = categoryOptions.value.find(opt => opt.id === versionId);
  return option ? option.label : '未知版本';
}

function getKeyfigureLabel(keyfigureId) {
  const option = keyfigureIdOptions.value.find(opt => opt.value === keyfigureId);
  return option ? option.label : '未知指标';
}


function handleAdd() {
  reset();
  open.value = true;
  title.value = "添加预测指标数据";
}

/**
 * 弹框更新指标数据
 * @param row
 */
function handleUpdate(row) {
  reset();
  open.value = true;
  title.value = "修改预测指标数据";
  form.value = row;
}

/**
 * 关闭弹框
 */
function cancel() {
  open.value = false;
  reset();
}

function handleDelete(row) {
  if (row.id) {
    //const _ids = row.id;
    const name = getKeyfigureLabel(row.keyfigureId);
    proxy.$modal.confirm('是否确认删除预测指标："' + name + '"的数据项？').then(function () {
      //return delTemplate(_ids);
      //从数组总过滤掉
      keyfingureList.value = keyfingureList.value.filter(item => item.id !== row.id);
    }).then(() => {
      // getList();
      proxy.$modal.msgSuccess("删除成功");
    }).catch(() => {
    });
  } else {
    proxy.$modal.confirm('是否确认删除预测指标："' + ids.value + '"的数据项？').then(function () {
      //return delTemplate(_ids);
      //从数组总过滤掉
      keyfingureList.value = keyfingureList.value.filter(item => ids.value.includes(item.id));
    }).then(() => {
      // getList();
      proxy.$modal.msgSuccess("删除成功");
    }).catch(() => {
    });
  }
}


function submitForm() {
  proxy.$refs["templateRef"].validate(valid => {
    if (valid) {
      if (form.value.id != null) {
        proxy.$modal.msgSuccess("修改成功");
        open.value = false;
        const keyfigure = keyfingureList.value.find(item => item.id === form.value.id);
        const oldkeyfigure = oldKeyfingureList.value.find(item => item.id === form.value.id);

        //找到对应的数据进行修改
        keyfigure.id = form.value.id;
        keyfigure.dim1 = form.value.dim1;
        keyfigure.dim2 = form.value.dim2;
        keyfigure.dim3 = form.value.dim3;
        keyfigure.dim4 = form.value.dim4;
        keyfigure.time = form.value.time;
        keyfigure.keyfigureId = form.value.keyfigureId;
        keyfigure.keyfigureValue = form.value.keyfigureValue;

        //修改对应的保存数据的额值
        oldkeyfigure.id = form.value.id;
        oldkeyfigure.dim1 = form.value.dim1;
        oldkeyfigure.dim2 = form.value.dim2;
        oldkeyfigure.dim3 = form.value.dim3;
        oldkeyfigure.dim4 = form.value.dim4;
        oldkeyfigure.time = form.value.time;
        oldkeyfigure.keyfigureId = form.value.keyfigureId;
        oldkeyfigure.keyfigureValue = form.value.keyfigureValue;

        // getList();
      } else {
        proxy.$modal.msgSuccess("新增成功");
        open.value = false;
        //声明一个新的维度对象
        let keyfigure = {};
        keyfigure.id = oldKeyfingureList.value.length + 1;
        keyfigure.dim1 = form.value.dim1;
        keyfigure.dim2 = form.value.dim2;
        keyfigure.dim3 = form.value.dim3;
        keyfigure.dim4 = form.value.dim4;
        keyfigure.time = form.value.time;
        keyfigure.keyfigureId = form.value.keyfigureId;
        keyfigure.keyfigureValue = form.value.keyfigureValue;
        keyfingureList.value.push(keyfigure);
        oldKeyfingureList.value.push(keyfigure);
        // getList();
      }
    }
  });
}

/** 提交上传文件 */
function submitFileForm() {
  upload.open = false;
  proxy.$modal.msgSuccess("导入成功");
};

/** 打开导入表弹窗 */
function openImportTable() {
  upload.title = "导入历史数据";
  upload.open = true;
}

/**
 * 搜索数据
 */
function handleQuery() {
  getList();
}

getList();
</script>